import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_smart_heating/common/http.dart';
import 'package:flutter_smart_heating/ui/ui.dart';
import 'package:get/get.dart';

class VideoMonitorPlayPage extends StatefulWidget {
  const VideoMonitorPlayPage({super.key, this.id, this.title});
  final dynamic id;
  final String? title;

  @override
  State<VideoMonitorPlayPage> createState() => _VideoMonitorPlayPageState();
}

class _VideoMonitorPlayPageState extends State<VideoMonitorPlayPage> {
  Map<String, dynamic> video = {};
  String? title;
  @override
  void initState() {
    title = widget.title ?? Get.parameters['title'];
    super.initState();
  }

  fetchData() async {
    var res = await Http.instance.post(
      '/api/information/video_monitor/detail',
      data: {
        'id': Get.parameters['id'],
      },
    );
    if (res.code == 1) {
      setState(() {
        video = res.data;
      });
    }
  }

  double aspectRatio = 16 / 9;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      appBar: AppBar(
        backgroundColor: Colors.black,
        foregroundColor: Colors.white,
        title: Text(
          video['name'] ?? title ?? '',
          style: const TextStyle(color: Colors.white),
        ),
      ),
      body: UiLifeCycle(
        onRouteDone: () {
          fetchData();
        },
        child: SafeArea(
          bottom: true,
          child: Center(
            child: video['play_url'] == null
                ? Container(
                    color: Colors.black,
                    child: const Center(
                      child: CupertinoActivityIndicator(),
                    ),
                  )
                : AspectRatio(
                    aspectRatio: aspectRatio,
                    child: UiVideo(
                      key: ValueKey(video['play_url']),
                      url: video['play_url'] ?? '',
                      title: video['name'],
                      isLive: video['is_live'],
                      autoPlay: true,
                      onReady: (val) {
                        setState(() {
                          aspectRatio = val;
                        });
                      },
                    ),
                  ),
          ),
        ),
      ),
    );
  }
}
